@charset "UTF-8";
.mj-tooltip {
  position: absolute;
  z-index: 100;
  background: rgba(70,76,91,.9);
  color: #fff;
  padding: 8px 12px;
  line-height: 20px;
  border-radius: 5px;
  box-sizing: border-box;
  box-shadow: 0 1px 6px rgb(0 0 0 / 20%);
  word-break:break-all;
  /*处理下箭头方向*/
}

.mj-tooltip:before {
  content: '';
  display: inline-block;
  border: 5px solid transparent;
  position: absolute;
}

.mj-tooltip.top-left:before {
  left: 15px;
  bottom: -10px;
  border-top-color: #666;
}

.mj-tooltip.top:before {
  left: 50%;
  bottom: -10px;
  border-top-color: #666;
  margin-left: -5px;
}

.mj-tooltip.top-right:before {
  right: 15px;
  bottom: -10px;
  border-top-color: #666;
}

.mj-tooltip.left:before {
  right: -10px;
  top: 50%;
  border-left-color: #666;
  margin-top: -5px;
}

.mj-tooltip.right:before {
  left: -10px;
  top: 50%;
  border-right-color: #666;
  margin-top: -5px;
}

.mj-tooltip.bottom-left:before {
  left: 15px;
  top: -10px;
  border-bottom-color: #666;
}

.mj-tooltip.bottom:before {
  left: 50%;
  top: -10px;
  border-bottom-color: #666;
  margin-left: -5px;
}

.mj-tooltip.bottom-right:before {
  right: 15px;
  top: -10px;
  border-bottom-color: #666;
}
